﻿<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--[if lt IE 9]>
<script type="text/javascript" src="lib/html5shiv.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="static/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.min.css" />
<link href="lib/Hui-iconfont/1.0.9/iconfont.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="static/css/style.css" />
<!--[if lt IE 9]>
<link href="static/css/H-ui.ie.css" rel="stylesheet" type="text/css" />
<![endif]-->
<!--[if IE 6]>
<script type="text/javascript" src="lib/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<title>媒体库</title>
<meta name="keywords" content="关键词,5个左右,单个8汉字以内">
<meta name="description" content="网站描述，字数尽量空制在80个汉字，160个字符以内！">
<style>
  .act-name{
    display:inline-block;
    width:175px;
    margin-right: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
  }

  .multi-stream-tag{
    display:inline-block;
    width:32px;
    border:1px solid #465567;
      border-radius: 2px;
    text-align:center;
    position: relative;
    right: 8px;
  }
  .act-item:hover .multi-stream-tag{
      color: #fff;
      border-color: #fff;
  }
</style>
</head>
<body ontouchstart>
<div class="wrap">
        <div id="rm-header" class="header clearfix" data-type="4" data-account="5">
            <div class="top">
                <a class="logo-wrap" href="/console/?c=index&amp;a=index">
					       <img src="http://cdn13.mudu.tv/assets/upload/147071101583626.jpg" style="">
                </a>
                <div class="mid">
                    <a href="/console/?c=index&amp;a=index" class="nav first active">首页</a>
                    <a href="/console?c=app" class="nav ">频道统计
                        <img class="new" src="../assets/console/images/new_menu.png" alt="">
                    </a>
                    <a href="/console/?c=data&amp;a=userlist" class="nav last " target="_blank">
                        观众画像
                    </a>
                    <a href="/console/?c=media" class="nav ">媒体库</a>
                </div>
                <div class="right-wrap">
                    <div id="msg-txt-wrap" class="hide">
                        <i class="iconfont" title="消息"></i>
                        <span class="num hide">0</span>
                    </div>
                    <div class="user-info act-manager">
                        <!-- <span class="dropDown">
                        	<a class="dropDown_A" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">管理员</a>
							<ul class="dropDown-menu menu radius box-shadow">
								<li><a href="#">多账号管理</a></li>
								<li><a href="#">密码设置</a></li>
								<li><a href="#">退出</a></li>
							</ul>
						</span> -->
						<div class="total-user-info" style="display: none;">
                  <a href="#">多账号管理</a>
                  <a href="#">密码设置</a>
                  <a href="#">退出</a>
                                                                          
              </div>
              <a id="username-link" title="账号设置" href="javascript:void(0)">
                  管理员</a>
              <i class="iconfont username-arrow"></i>
          </div>
				</div>
            </div>
           <div class="link clearfix">
                <div id="rm-channel" class="left">
                    
					<div class="chooseChannel">
					  <strong title="TEST"><i class="iconfont"></i>TEST</strong>
					  <span class="pull-down"></span>
					  <ul id="cChannel" class="hide">
					    <li>
					        <a class="act-item" href="/console/?c=broadcast&amp;a=index&amp;id=200930">
					            <span class="act-name">楚楚1</span>
					            <!-- <span class="multi-stream-tag">多流</span> -->
					        </a>
					     </li>
					    <li>
					        <a class="act-item" href="/console/?c=broadcast&amp;a=index&amp;id=200929">
					            <span class="act-name">测试</span>
					        </a>
					    </li>
					    <li>
					        <a class="act-item" href="/console/?c=broadcast&amp;a=index&amp;id=200458">
					            <span class="act-name">111</span>
					    </a>
					    </li>
					    <li>
					        <a class="act-item" href="/console/?c=broadcast&amp;a=index&amp;id=197381">
					            <span class="act-name">测试</span>
					        </a>
					    </li>
					    </ul>
					</div>
				</div>
        <button type="button" class="ant-btn" ><i class="anticon anticon-link"></i><span>观看地址</span></button>

        <ul class="right">
        			<a href="live.html" class="first-child brdcast active">
                  <li>
                      <i class="Hui-iconfont Hui-iconfont-bofang"></i><span>直播控制</span>
                  </li>
              </a>
              <a href="set.html" class="cnlmana ">
                  <li>
                      <i class="Hui-iconfont Hui-iconfont-manage2"></i><span>频道管理</span>
                  </li>
              </a>
              <a href="audience_statistics.html" class="usermana ">
                  <li>
                      <i class="Hui-iconfont Hui-iconfont-user2"></i><span>观众统计</span>
                  </li>
              </a>
              <a href="/console/?c=data&amp;a=analysis&amp;id=194801" class="last-child anycal ">
                  <li>
                      <i class="Hui-iconfont Hui-iconfont-shujutongji"></i><span>数据统计</span>
                  </li>
              </a>
			    </ul>
            </div>
        </div>
        
  <div id="rm-main" class="main clearfix">
            <div id="media" class="media" data-useid="10895">
    <div class="rightContent" style="margin-left:0px;padding: 20px;background-color: #999;">
        <div class="content-col1 content-col" style="border-radius: 10px 10px 0 0;">
           <p class="title title-first" style="height: 36px;line-height: 36px;padding-left: 15px;">视频列表</p>
        </div>
        <div class="content-block " style="">
            <div id="media-search-bar" >
              <div class="media-search-bar">
                <!-- <span class="search-cascader ant-cascader-picker" tabindex="0">
                  <span class="ant-cascader-picker-label" ></span>
                  <input value="" placeholder="按频道/上传视频搜索" class="ant-input ant-cascader-input " readonly="" autocomplete="off" type="text" >
                  <i class="anticon anticon-down ant-cascader-picker-arrow"></i>
                </span> -->
                <label>按频道/上传视频搜索</label>
                <select class="select" style="width: auto;color: rgb(153, 153, 153);border-radius: 5px;height: 28px;font-size: 12px;">
                  <option value="0">全部视频</option>
                  <option value="1">频道直播视频</option>
                  <option value="2">我上传的视频</option>
                </select>
                <span style="margin-right:7px;">按时间搜索</span>
                <span class="ant-calendar-picker" style="width:295px;" >
                  <span class="ant-calendar-picker-input ant-input" >
                    <input readonly="" value="" placeholder="开始日期" class="ant-calendar-range-picker-input start_time" >
                    <span class="ant-calendar-range-picker-separator"> ~ </span>
                    <input readonly="" value="" placeholder="结束日期" class="ant-calendar-range-picker-input end_time" >
                    <span class="ant-calendar-picker-icon"></span>
                  </span>
                </span>
                <div class="search-input-wrap">
                  <span class="ant-input-group-wrapper" >
                    <span class="ant-input-wrapper ant-input-group">
                      <input placeholder="输入文件名" value="" type="text" class="ant-input">
                      <span class="ant-input-group-addon">
                        <i class="Hui-iconfont Hui-iconfont-search1"></i>
                      </span>
                    </span>
                  </span>
                </div>
                <a href="javascript:void(0)">清空</a>
              </div>
            </div>
            <div id="media-live-operate-bar">
            <div class="media-operate-bar" >
            <label class="ant-checkbox-wrapper">
            <span class="ant-checkbox" >
              <input type="checkbox" class="ant-checkbox-input" >
              <span class="ant-checkbox-inner"></span>
            </span>
            <span >全选</span>
            </label>
            <span>已选 (<em id="checkedCount">0</em>)</span>
            <button type="button" class="ant-btn" >
              <i class="iconfont"></i>
              <span >删除</span>
            </button>
            <a id="uploadfile" href="javascript:void(0)" class="ant-btn ant-btn-primary uploadbtn webuploader-container">
              <div class="webuploader-pick" style="padding-top: 3px;">上传视频</div>
              <div id="rt_rt" style="position: absolute; top: 0px; left: 15px; width: 48px; height: 27px; overflow: hidden; bottom: auto; right: auto;">
                <input type="file" id="file" name="file" class="webuploader-element-invisible" multiple="multiple" accept="video/mp4 flv avi m3u8 mkv wmv rmvb mpeg quicktime x-ms-asf">
                <label for="file" style="opacity: 0; width: 100%; height: 100%; display: block; cursor: pointer; background: rgb(255, 255, 255);"></label>
              </div>
            </a>
            <span class="upload-txt hide"><span>视频上传中...(</span><span>0</span><span >/</span><span>0</span><span >)&nbsp;</span>
            <i class="anticon anticon-down"></i></span>
<!--             <div id="UploadPopover" class="hide" style="left:500px;top:40px;" >
            <div class="ant-popover-content">
            <div class="ant-popover-arrow"></div>
            <div class="ant-popover-inner" >
            <div style="padding-bottom:20px;">
            <div class="ant-popover-inner-content">
            <div style="width:340px;"></div>
            </div>
            </div>
            </div>
            </div>
            </div> -->
            </div>
            </div>

            <div id="block" class="content-col  content-col4" style="width: 100%;border-radius: 0 0 10px 10px ;background-color: #fff">
            <div id="mediaListWrap" class="clearfix">
              <div class="video-card-wrapper selected media-video-card-wrap">
                <i class="Hui-iconfont Hui-iconfont-weigouxuan2 Hui-iconfont-xuanzhong1"></i>
                <input type="checkbox" name="video_card[]" checked class="video_card" value="1" style="display: none;" >
                <div class="video-card-preview" >
                  <span class="cover-edit-icon">
                    <i class="iconfont"></i>
                  </span>
                  <img src="https://myun-hw-s3.myun.tv/melj80jz/0eedoej0/1560334605107219041.jpg">
                  <img src="../assets/img/console/pause.png" class="preview-btn">
                  <p class="video-duration">00:00:57</p>
                </div>
                <div class="video-card-info">
                    <input value="2" type="text" class="ant-input ant-input-sm">
                  <p class="upload-time-resolution" >
                    <span class="upload-time">
                      <span>上传时间：</span>
                      <span>2019-06-12</span>
                    </span>
                    <span class="resolution">
                    <span >分辨率：</span>
                    <span >400 * 224</span>
                    </span>
                  </p>
                  <span class="video-card-link" >
                    <label class="clarity-right" ><a href="javascript:void(0)" style="margin-right:8px;" >嵌入地址</a><noscript ></noscript><a href="javascript:void(0)">下载地址</a><noscript ></noscript></label>
                  </span>
                </div>
              </div>

              <div class="video-card-wrapper media-video-card-wrap">
                  <i class="Hui-iconfont Hui-iconfont-weigouxuan2"></i>
                  <input type="checkbox" name="video_card[]" class="video_card" value="2" style="display: none;" >
                <div class="video-card-preview" >
                  <span class="cover-edit-icon">
                    <i class="iconfont"></i>
                  </span>
                  <img src="https://myun-hw-s3.myun.tv/melj80jz/0eedoej0/1560334605107219041.jpg">
                  <img src="../assets/img/console/pause.png" class="preview-btn">
                  <p class="video-duration">00:00:57</p>
                </div>
                <div class="video-card-info">
                    <input value="2" type="text" class="ant-input ant-input-sm">
                  <p class="upload-time-resolution" >
                    <span class="upload-time">
                      <span>上传时间：</span>
                      <span>2019-06-12</span>
                    </span>
                    <span class="resolution">
                    <span >分辨率：</span>
                    <span >400 * 224</span>
                    </span>
                  </p>
                  <span class="video-card-link" >
                    <label class="clarity-right" ><a href="javascript:void(0)" style="margin-right:8px;" >嵌入地址</a><noscript ></noscript><a href="javascript:void(0)">下载地址</a><noscript ></noscript></label>
                  </span>
                </div>
              </div>
            </div>
            </div>
        </div>
        </div>
        </div>
    </div>
</div>

        </div>
	<div id="rm-footer" class="footer clearfix">
	    <img src="http://cdn13.mudu.tv/assets/upload/147070872782018.png" style="width:390px; height:110px;" alt="目睹直播">
	</div>
</div>
<script type="text/javascript" src="lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="lib/jquery-ui/1.9.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="static/js/H-ui.js"></script>
<script type="text/javascript" src="lib/layer/2.4/layer.js"></script>
<script type="text/javascript">
  $(".start_time,.end_time").datetimepicker({
  format: "yyyy-mm-dd hh:ii:ss",
  autoclose: true
});
</script>

<script>
$("#live_video_btn").click(function(){
    location.hash="#live_video";
})

$("#video_btn").click(function(){
    location.hash="#video";
})

if(location.hash=="#live_video"){
   setTimeout(function(){
       $("#live_video_btn").trigger("click");
       $("#live_video_btn").trigger("mouseenter");
   },600)
}

// 全选
$('.ant-checkbox').on('click',function(){
  if ($(this).hasClass('ant-checkbox-checked')) {
    $(this).removeClass('ant-checkbox-checked');
    $('#mediaListWrap').find('.Hui-iconfont-weigouxuan2').removeClass('Hui-iconfont-xuanzhong1');
    $('#mediaListWrap').find('.video_card').prop("checked",false);
    $('#mediaListWrap').find('.media-video-card-wrap').removeClass('selected');
  }else{
    $(this).addClass('ant-checkbox-checked');
    $('#mediaListWrap').find('.Hui-iconfont-weigouxuan2').addClass('Hui-iconfont-xuanzhong1');
    $('#mediaListWrap').find('.video_card').prop("checked",true);
    $('#mediaListWrap').find('.media-video-card-wrap').addClass('selected');
  }
  checkedCount()
})
// 选中
$('.media-video-card-wrap').on('click',function(){
  
  if ($(this).find('.video_card').is(':checked')) {
   $(this).find('.Hui-iconfont-weigouxuan2').removeClass('Hui-iconfont-xuanzhong1');
   $(this).removeClass('selected');
   $(this).find('.video_card').prop("checked",false);
  }else{
    $(this).find('.Hui-iconfont-weigouxuan2').addClass('Hui-iconfont-xuanzhong1');
    $(this).find('.video_card').prop("checked",true);
    $(this).addClass('selected');
  }
  checkedCount()
})

function checkedCount(){

  var _length =  $("input[name='video_card[]']:checked").length;
  $('#checkedCount').text(_length);
}

$('#file').change(function(){
  if (!checkTv()) {
    document.getElementById('file').value="";
    $.Huimodalalert('不是指定视频格式,重新选择！',2000)
  }else{
    // 表单提交
    
  }
  
})
function checkTv(){
 var tv_id =document.getElementById('file').value;//根据id得到值
 var index= tv_id.indexOf("."); //（考虑严谨用lastIndexOf(".")得到）得到"."在第几位
 tv_id=tv_id.substring(index); //截断"."之前的，得到后缀
  if(tv_id!=".mp4"&&tv_id!=".flv"&&tv_id!=".avi"&&tv_id!=".m3u8"&&tv_id!=".mkv"&&tv_id!=".wmv"&&tv_id!=".rmvb"&&tv_id!=".mpeg"&&tv_id!=".quicktime"&&tv_id!=".x-ms-asf"){ //根据后缀，判断是否符合视频格式
    document.getElementById('file').value="";   // 不符合，就清除，重新选择
    return false;
   }else{
    return true;
  }
}
</script>

</body>
</html>
